/**
 * Created by xuqinyuan on 2017/12/11.
 */
import React, {PureComponent} from 'react';
import styles from './index.less';
import {connect } from 'dva';
import {Table,Switch,Button, Icon, InputNumber, Tooltip, Popconfirm}  from 'antd';
import constants from '../../../common/constants';
import { routerRedux } from 'dva/router';
import {powerControl} from '../../../utils/powerControl';
const AuthButton = powerControl(Button);
@connect((state)=>({
    goodsManage:state.goodsManage,
}))
export default class GoodsManageTable extends PureComponent{

    handleEditRow = (record, pagination) => {
        this.props.onEditRow(record, pagination);
    }

    handleChangeOnsale = (goods_id,state,pagination) => {
        this.props.handleChangeOnsale(goods_id,state, pagination);
    }

    handleDelRow = (goods_id, pagination) => {
        this.props.onDelRow(goods_id, pagination);
    }

    handleTableChange = (pagination, filters, sorter) => {
        this.props.onChange(pagination, filters, sorter);
    }

    handleReturnDetails = (record,pagination) => {
       const {dispatch} = this.props;
        dispatch({
            type: 'goodsManage/keepData',
            payload: {
                ...record,
                editType: 'mod',
                goods_id: record.goods_id,
            },
        });
        dispatch(routerRedux.push('/goods/goodsDetails'));

    }

    handleRecommendRow = (record, pagination) => {
        this.props.onRecommendRow(record,pagination);
    }

    render(){
        const {data: {list, pagination}, loading} = this.props;
        const columns = [
        {
            title:'商品ID',dataIndex:'goods_id',width:'2%',
            render: (val, record) => {
                return <Tooltip placement="right" title={record.goods_id}>
                    <span>{val}</span>
                </Tooltip>
            }
        },
        // {
        //     title:'父商品ID',
        //     dataIndex:'parent_goods_id',
        // },
        {
            title:'商品名称', dataIndex:'goods_name',width:'3%',
            render: (val, record) => {
                return <Tooltip placement="right" title={record.goods_name}>
                    <span>{val}</span>
                </Tooltip>
            }
        },{
            title:'所属分类',dataIndex:'cat_name',width:'3%',
                render: (val, record) => {
                    return <Tooltip placement="right" title={record.cat_name}>
                        <span>{val}</span>
                    </Tooltip>
                }
        },{
            title:'用户名称',dataIndex:'user_name',width:'2%',
            render: (val, record) => {
                return <Tooltip placement="right" title={record.user_name}>
                    <span>{val}</span>
                </Tooltip>
            }
        },{
            title:'唯一货号',dataIndex:'goods_sn',width:'3%',
            render: (val, record) => {
                return <Tooltip placement="right" title={record.goods_sn}>
                    <span>{val}</span>
                </Tooltip>
            }
        },{
            title:'点击数',dataIndex:'click_count',width:'2%',
                render: (val, record) => (
                    <InputNumber min={0} defaultValue={val} size={5}/>
                )
        },{
            title:'品牌名称',dataIndex:'brand_name',width:'2%',
            render: (val, record) => {
                return <Tooltip placement="right" title={record.brand_name}>
                    <span>{val}</span>
                </Tooltip>
            }
        },{
            title:'商品库存数量',dataIndex:'goods_number',width:'2%',
            render: (val, record) => (
                <InputNumber min={1} defaultValue={val} value={val} size={3}/>
            )
        },{
            title:'商品的重量(kg)', dataIndex:'goods_weight',width:'2%',
            render: (val, record) => (
                <InputNumber defaultValue={val} value={val} size={3}/>
            )
        },{
            title:'市场售价',dataIndex:'market_price',width:'2%',
            render: (val, record) => (
                <InputNumber defaultValue={val} value={val} size={3}/>
            )
        },{
            title:'成本价',dataIndex:'cost_price',width:'2%',
            render: (val, record) => (
                <InputNumber defaultValue={val} value={val} size={3}/>
            )
        },{
            title:'供货价',dataIndex:'supply_price',width:'2%',
            render: (val, record) => (
                <InputNumber defaultValue={val} value={val} size={3}/>
            )
        },{
            title:'本店售价',dataIndex:'shop_price',width:'2%',
            render: (val, record) => (
                <InputNumber defaultValue={val} value={val} size={3}/>
            )
        },{
            title:'促销价格',dataIndex:'promote_price',width:'2%',
            render: (val, record) => (
                <InputNumber defaultValue={val} value={val} size={3}/>
            )
        },{
            title:'促销价格开始日期',dataIndex:'promote_start_date',width:'3%',
            render: (val, record) => {
                return <Tooltip placement="right" title={record.promote_start_date}>
                    <span>{val}</span>
                </Tooltip>
            }
        },{
            title:'促销价格结束日期', dataIndex:'promote_end_date',width:'3%',
            render: (val, record) => {
                return <Tooltip placement="right" title={record.promote_end_date}>
                    <span>{val}</span>
                </Tooltip>
            }
        },{
            title:'商品报警数量',dataIndex:'warn_number',width:'2%',
            render: (val, record) => (
                <InputNumber defaultValue={val} value={val} size={3}/>
            )
        },{
            title:'商品关键字',dataIndex:'keywords',width:'3%',
            render: (val, record) => {
                return <Tooltip placement="right" title={record.keywords}>
                    <span>{val}</span>
                </Tooltip>
            }
        },{
            title:'商品的简短描述', dataIndex:'goods_brief',width:'6%',
                render: (val, record) => {
                    return <Tooltip placement="right" title={record.goods_brief}>
                        <span>{val}</span>
                    </Tooltip>
                }
            },
        //     {
        //     title:'商品的详细描述',
        //     dataIndex:'goods_desc',
        // },
        {
            title:'前台显示的微缩图片',dataIndex:'goods_thumb',width:'2%',
            render:(val,record)=>{
                return (
                    <Tooltip placement="right" title={record.goods_thumb}>
                        <img src={`${constants.imageUrlFix}${val}`} style={{width:50,height:50}}/>
                    </Tooltip>
                )
            }
        },{
            title:'商品的实际大小图片', dataIndex:'goods_img',width:'2%',
            render:(val,record)=>{
                return (
                    <Tooltip placement="right" title={record.goods_img}>
                        <img src={`${constants.imageUrlFix}${val}`} style={{width:50,height:50}}/>
                    </Tooltip>
                )
            }
        },{
            //1，是；0，否
            title:'是否实物', dataIndex:'is_real',width:'2%',
            render:(val)=>{
                return (<Switch checkedChildren={<Icon type="check"/>} unCheckedChildren={<Icon type="close"/>} checked={val} defaultChecked={val}/>)
            }
        },{
            //1，是；0，否'
            title:'是否开放销售', dataIndex:'is_on_sale',width:'2%',
            render:(val,record)=>{
                return  <Tooltip placement="right" title={record.is_on_sale}>
                    <span>{val}</span>
                </Tooltip>
                // return (<Switch checkedChildren={<Icon type="check"/>} unCheckedChildren={<Icon type="close"/>} checked={val} defaultChecked={val}/>)
            }
        },{
            title:'是否单独销售',//1，是；0，否
            dataIndex:'is_alone_sale',width:'2%',
            render:(val)=>{
                return (<Switch checkedChildren={<Icon type="check"/>} unCheckedChildren={<Icon type="close"/>} checked={val} defaultChecked={val}/>)
            }
        },{
            title:'添加时间',dataIndex:'add_times',width:'3%',
            render: (val, record) => {
                return <Tooltip placement="right" title={record.add_times}>
                    <span>{val}</span>
                </Tooltip>
            }
        },{
            title:'显示顺序',dataIndex:'sort_order',width:'2%',
            render: (val, record) => (
                <InputNumber defaultValue={val} value={val} size={3}/>
            )
        },{
            title:'是否删除',
            dataIndex:'is_delete',width:'2%',
            render:(val)=>{
                return (<Switch checkedChildren={<Icon type="check"/>} unCheckedChildren={<Icon type="close"/>} defaultChecked={val}/>)
            }
        },{
            title:'是否精品',
            dataIndex:'is_best',width:'2%',
            render:(val)=>{
                return (<Switch checkedChildren={<Icon type="check"/>} unCheckedChildren={<Icon type="close"/>} defaultChecked={val}/>)
            }
        },{
            title:'是否新品',
            dataIndex:'is_new',width:'2%',
            render:(val)=>{
                return (<Switch checkedChildren={<Icon type="check"/>} unCheckedChildren={<Icon type="close"/>} defaultChecked={val}/>)
            }
        },{
            title:'是否热销',
            dataIndex:'is_hot',width:'2%',
            render:(val)=>{
                return (<Switch checkedChildren={<Icon type="check"/>} unCheckedChildren={<Icon type="close"/>} defaultChecked={val}/>)
            }
        },{
            title:'是否特价促销',
            dataIndex:'is_promote',width:'2%',
            render:(val)=>{
                return (<Switch checkedChildren={<Icon type="check"/>} unCheckedChildren={<Icon type="close"/>} defaultChecked={val}/>)
            }
        },{
            title:'所属类型',dataIndex:'typeName',width:'3%',
            render: (val, record) => {
                return <Tooltip placement="right" title={record.typeName}>
                    <span>{val}</span>
                </Tooltip>
            }
        },{
            title:'商品的商家备注',dataIndex:'seller_note',width:'3%',
            render: (val, record) => {
                return <Tooltip placement="right" title={record.seller_note}>
                    <span>{val}</span>
                </Tooltip>
            }
        },{
            title:'赠送的积分',dataIndex:'give_integral',width:'2%',
            render: (val, record) => (
                <InputNumber defaultValue={val} value={val} size={3}/>
            )
        },{
            title:'等级积分',dataIndex:'rank_integral',width:'2%',
            render: (val, record) => (
                <InputNumber defaultValue={val} value={val} size={3}/>
            )
        },{
            title:'是否限购',
            dataIndex:'is_xiangou',width:'2%',
            render:(val)=>{
                return (<Switch checkedChildren={<Icon type="check"/>} unCheckedChildren={<Icon type="close"/>} defaultChecked={val}/>)
            }
        },{
            title:'限购开始时间', dataIndex:'xiangou_start_date',width:'3%',
            render: (val, record) => {
                return <Tooltip placement="right" title={record.xiangou_start_date}>
                    <span>{val}</span>
                </Tooltip>
            }
        },{
            title:'限购结束时间',dataIndex:'xiangou_end_date',width:'3%',
            render: (val, record) => {
                return <Tooltip placement="right" title={record.xiangou_end_date}>
                    <span>{val}</span>
                </Tooltip>
            }
        },{
            title:'限购设定数量',dataIndex:'xiangou_num',width:'2%',
            render: (val, record) => (
                <InputNumber defaultValue={val} value={val} size={3}/>
            )
        },{
            title:'商品标签',dataIndex:'goods_tag',width:'2%',
            render: (val, record) => {
                return <Tooltip placement="right" title={record.goods_tag}>
                    <span>{val}</span>
                </Tooltip>
            }
        },{
            title:'计量单位',dataIndex:'measure_unit',width:'2%',
            render: (val, record) => {
                return <Tooltip placement="right" title={record.measure_unit}>
                    <span>{val}</span>
                </Tooltip>
            }
        },{
            title:'所属商家',dataIndex:'from_seller_name',width:'2%',
            render: (val, record) => {
                return <Tooltip placement="right" title={record.from_seller_name}>
                    <span>{val}</span>
                </Tooltip>
            }
        },{
            title: '操作',
            fixed: 'right',
            render: (val, record) => (
                <p>
                    {
                        record.is_on_sale == '上架' ?
                        <span>
                        <AuthButton ghost size="small" auth="goodsManage.edit" className={styles.btn}  onClick={() => this.handleChangeOnsale(record.goods_id, 0, pagination)}>下架</AuthButton>
                        <span className={styles.splitLine}/>
                        <AuthButton ghost size="small" auth="goodsManage.edit" className={styles.btn}  onClick={() => this.handleChangeOnsale(record.goods_id, 2, pagination)}>挂起</AuthButton>
                        <span className={styles.splitLine}/></span>
                        :
                        record.is_on_sale == '下架' ?
                            <span>
                        <AuthButton ghost size="small" auth="goodsManage.edit" className={styles.btn}  onClick={() => this.handleChangeOnsale(record.goods_id, 1, pagination)}>上架</AuthButton>
                        <span className={styles.splitLine}/>
                        <AuthButton ghost size="small" auth="goodsManage.edit" className={styles.btn}  onClick={() => this.handleChangeOnsale(record.goods_id, 2, pagination)}>挂起</AuthButton>
                        <span className={styles.splitLine}/></span>
                         :
                            <span>
                        <AuthButton ghost size="small" auth="goodsManage.edit" className={styles.btn}  onClick={() => this.handleChangeOnsale(record.goods_id, 1, pagination)}>上架</AuthButton>
                        <span className={styles.splitLine}/>
                        <AuthButton ghost size="small" auth="goodsManage.edit" className={styles.btn}  onClick={() => this.handleChangeOnsale(record.goods_id, 0, pagination)}>下架</AuthButton>
                        <span className={styles.splitLine}/></span>
                    }

                    <AuthButton ghost size="small" auth="goodsManage.edit" className={styles.btn}  onClick={() => this.handleEditRow(record, pagination)}>编辑</AuthButton>
                    <span className={styles.splitLine}/>
                    <Popconfirm title="是否确定删除?" onConfirm={() => this.handleDelRow(record.goods_id, pagination)} >
                        <AuthButton ghost size="small" auth="goodsManage.delete" className={styles.btn} >删除</AuthButton>
                    </Popconfirm>
                    <span className={styles.splitLine}/>
                    <AuthButton ghost size="small" auth="goodsManage.recommend" className={styles.btn}  onClick={() => this.handleRecommendRow(record, pagination)}>推荐</AuthButton>
                    <span className={styles.splitLine}/>
                    <AuthButton ghost size="small" auth="goodsManage.comment" className={styles.btn}  onClick={()=>this.handleReturnDetails(record, pagination)} >评价</AuthButton>
                </p>
            ),
        },];
        const paginationProps={
            showQuickJumper:true,
            showSizeChanger:true,
            ...pagination,
        }
        return (
            <div className={styles.standardTable}>
                <Table
                    key={new Date()}
                    loading={loading}
                    columns={columns}
                    size="small"
                    dataSource={list}
                    scroll={{x:10000}}
                    pagination={paginationProps}
                    rowKey={record => record.goods_id}
                    onChange={this.handleTableChange}/>
            </div>
        )
    }
}